<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover">
  <meta content="telephone=no" name="format-detection" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  <script src="js/rem.js"></script>
  <link href="css/base.css" rel="stylesheet" type="text/css" />
  <link rel="dns-prefetch" href="//res.wx.qq.com" />
  <title>生活小常识竞赛</title>
</head>

<body>
  <div class="w640">
    

    <div class="main">
      <!-- 首页 -->
      <div class="index">
        <div class="btn-group">
          <button class="btn-item" onclick="startTest()">开始答题</button>
          <button class="btn-item" onClick="switchPage('employee')">员工通道</button>
        </div>
        <div class="rule" style="display: none;">
          <li>
            <h4>活动规则</h4>
            <h5>1.xxxxxxxxxxxxx</h5>
            <h5>2.xxxxxxxxxxxxx</h5>
            <h5>3.xxxxxxxxxxxxx</h5>
          </li>
        </div>
      </div>

      <!-- 员工通道 -->
      <div class="employee">
        
        <div class="input-group">
          <input id="employee_id" type="text" class="input-item" value="输入工号ID" onfocus="if(value=='输入工号ID'){value=''}"
            onblur="if (value ==''){value='输入工号ID'}">
        </div>

        <div class="btn-group">
          <button class="btn-item" onclick="createShareQRcode()">生成二维码</button>
          <button class="btn-item" onclick="createShareWechat()">分享朋友圈</button>
          <button class="btn-item" onclick="switchPage('index')">返回上一级</button>
        </div>

        <div id="qrcode" style="text-align: center; margin: auto; width: 10rem; ">
        </div>

        <div id="show_result" style="display: none; z-index: 10001; margin:0 auto; width:2rem; height: 2rem; overflow-y: scroll;border: 3px solid blanchedalmond;">
          <img id="img_qrcode_result" />
        </div>

      </div>

      <!-- 生成二维码时的背景 -->
      <div class="share">
        <div style="width:2rem; margin:0 auto;">
          <img id="img_qrcode" />
        </div>
      </div>

      <!-- 答题时的背景图片 -->
      <div class="question">
      </div>

      <!-- 答题结果展示页面 -->
      <div class="result" style="background-color:antiquewhite;margin:0 0.4rem;padding-bottom: 0.4rem;">
        <div class="txt">
          <p>您答对了<span id="rightNo">6</span>题，答错了<span id="wrongNo">4</span>题</p>
          <p id="show_tip_0">感谢您的积极参与，请再接再厉！</p>
        </div>
        <div class="head"><img src="res/head.jpg" style="border-radius: 50%;"></div>
        <div class="btn-group">
          <button class="btn-item" onclick="createShareWechat()">分享朋友圈</button>
          <button class="btn-item" onclick="switchPage('index')">再做一遍</button>
        </div>
      </div>

      <!--
      <footer id="f" class="html5"><span>哈密市商业银行</span></footer>
      -->
    
    </div> <!-- end of main -->
    
    <!-- prefetch pictures -->
    <div style='display:none;'>
      <img src='res/right_0.gif' />
      <img src="res/right_1.gif" />
      <img src="res/wrong_0.jpg" />
      <img src="res/wrong_1.jpg" />
      <img src='res/indexbg.jpg' />
    </div>
  </div> <!-- end of w640 -->

  <!-- 分享朋友圈引导页 -->
  <div class="wechat_share_guide" style="display: none;">
    <div class="shade" style="position: absolute; z-index:10001; left:0; top:0; width:100%; height: 100%; background-color: gray; opacity: 0.9;">
    </div>
    <div class="wechat_share_guide_img" style="position: absolute; z-index:10002; left:0; top:0; width:100%; height: 100%;">
      <img src="res/wechat_share_guide.png" />
    </div>
  </div>

  <!-- 保存二维码引导页 -->
  <div class="qrcode_save_guide" style="display: none;">
    <div class="shade" style="position: absolute; z-index:10001; left:0; top:0; width:100%; height: 100%; background-color: gray; opacity: 0.9;">
    </div>
    <div class="qrcode_save_guide_img" style="position: absolute; z-index:10002; left:0; top:0; width:100%; height: 100%;">
      <img src="res/qrcode_save_guide.png" />
    </div>
  </div>

  <!-- 答题弹出层 -->
  <div class="popWrap question-dialog" style="top:20%">
    <div class="popInner">
        <h2 class="clearfix">
          <span class="fl pdlr5"><em class="cyellow" id="dd">30</em>秒</span>
          <span class="index fr pdlr5"><em class="cyellow" id="currentNo">1</em>/<em id="totalNo">10</em></span>
        </h2>
        <div class="content pd10">
            <div class="title" id="questionTitle">1.XXXXXXXXXX</div>
            <div class="option">
                <ul id="questionList">
                    <li><em>0</em><span>XXXX</span></li>
                    <li><em>1</em><span>XXXX</span></li>
                    <li><em>2</em><span>XXXX</span></li>
                    <li><em>3</em><span>XXXX</span></li>
                </ul>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/fun.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="js/qrcode.min.js"></script>
<script type="text/javascript" src="js/html2canvas.min.js"></script>
<script src="//res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script type="text/javascript">
$(function () {
  initIndexPage();
  //switchPage('result');
});
</script>